// 以同步的方式进行事件监听

function getElement(cssSelector) {
  let proxyDom = new Proxy(document.querySelector(cssSelector), {
    get(target, key) {
      if (!key.startsWith('wait')) {
        return target[key];
      }
      let eventName = key.replace('wait', '').toLowerCase();
      return new Promise((resolve) => {
        target.addEventListener(eventName, resolve, {
          capture: false, // 冒泡阶段
          once: true, // 只触发一次，之后移除
          passive: false // 监听器会调用 preventDefault()
          // signal // 允许通过 AbortController 移除事件监听器
        });
      });
    }
  });
  return proxyDom;
}

export default getElement;

// 使用
// async mounted() {
//   const btn = getElement('.box');
//   for (let i = 0; i < 10; i++) {
//     const e = await btn.waitClick;
//     console.log('按钮被点击了', e);
//   }
// }

// // 通过 AbortController 移除事件
// const controller = new AbortController();
// element.addEventListener("click", handler, {
//   signal: controller.signal
// });
// controller.abort(); // 移除事件监听器
